<script lang="jsx" setup>
import { ref } from 'vue';
import Form from '@/components/common/form.vue';

const props = defineProps({
  rowData: {
    type: Object,
    default: () => null
  }
});

const formList = [
  {
    type: 'input',
    key: 'warehouse',
    label: '仓库',
    placeholder: '请输入仓库',
    span: 12,
    disabled: true
  },

  {
    type: 'input',
    key: 'date',
    label: '日期',
    placeholder: '请输入日期',
    span: 12,
    disabled: true
  },

  {
    type: 'input',
    key: 'data1',
    label: '01:00温度',
    placeholder: '请输入01:00温度',
    span: 12
  },

  {
    type: 'input',
    key: 'data2',
    label: '01:00湿度',
    placeholder: '请输入01:00湿度',
    span: 12
  },

  {
    type: 'input',
    key: 'data3',
    label: '05:00温度',
    placeholder: '请输入05:00温度',
    span: 12
  },
  {
    type: 'input',
    key: 'data4',
    label: '05:00湿度',
    placeholder: '请输入05:00湿度',
    span: 12
  },
  {
    type: 'input',
    key: 'data5',
    label: '09:00温度',
    placeholder: '请输入09:00温度',
    span: 12
  },
  {
    type: 'input',
    key: 'data6',
    label: '09:00湿度',
    placeholder: '请输入09:00湿度',
    span: 12
  },
  {
    type: 'input',
    key: 'data7',
    label: '13:00温度',
    placeholder: '请输入13:00温度',
    span: 12
  },
  {
    type: 'input',
    key: 'data8',
    label: '13:00湿度',
    placeholder: '请输入13:00湿度',
    span: 12
  },
  {
    type: 'input',
    key: 'data9',
    label: '17:00温度',
    placeholder: '请输入17:00温度',
    span: 12
  },
  {
    type: 'input',
    key: 'data10',
    label: '17:00湿度',
    placeholder: '请输入17:00湿度',
    span: 12
  },
  {
    type: 'input',
    key: 'data11',
    label: '21:00温度',
    placeholder: '请输入21:00温度',
    span: 12
  },
  {
    type: 'input',
    key: 'data12',
    label: '21:00湿度',
    placeholder: '请输入21:00湿度',
    span: 12
  }
];

function getModel() {
  const obj = {};
  formList.forEach(item => {
    if (item.key && item.span) {
      obj[item.key] = props.rowData[item.key];
    }
  });
  return obj;
}
const formRef = ref(null);

const model = ref(getModel());

function validateForm() {
  return formRef.value.validateForm();
}

defineExpose({
  model: model.value,
  validateForm
});
</script>

<template>
  <div class="event-form">
    <Form ref="formRef" v-model:model="model" :form-list="formList"></Form>
  </div>
</template>

<style lang="scss" scoped></style>
